<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title></title>
	<link rel="stylesheet" href="">
</head>
<body>
<script>
	console.log('document.body',document.body)
	console.log('document.documentElement',document.documentElement)
	// document.documentElement 与 document.body的应用场景
	// 获取 scrollTop 方面的差异
	// 在chrome(版本 52.0.2743.116 m)下获取scrollTop只能通过document.body.scrollTop,而且DTD是否存在,不会影响 document.body.scrollTop的获取。
	// 通过console查看结果：
	// demo 1 with doctype : http://jsbin.com/cisacam 
	// demo 2 without doctype: http://jsbin.com/kamexad/16
	
	// 在firefox(47.0)及 IE(11.3)下获取scrollTop，DTD是否存,会影响document.body.scrollTop 与 document.documentElement.scrollTop的取值
	// 在firefox(47.0)

	// 页面存在DTD，使用document.documentElement.scrollTop获取滚动条距离；

	// 页面不存在，使用document.body.scrollTop 获取滚动条距离

	// demo 1 with doctype : http://jsbin.com/cisacam 

	// demo 2 without doctype: http://jsbin.com/kamexad/16
	// IE(11.3)
	// 页面存在DTD，使用document.documentEelement.scrollTop获取滚动条距离

	// 页面不存在DTD,使用document.documentElement.scrollTop 或 document.body.scrollTop都可以获取到滚动条距离

	// demo 1 with doctype : http://jsbin.com/cisacam 

	// demo 2 without doctype: http://jsbin.com/kamexad/16
	
	// 兼容解决方案：
	var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
	console.log('scrollTop',scrollTop)
</script>	
</body>
</html>